﻿<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
    <title>乐优商城--商品详情页</title>
    <link rel="icon" href="/assets/img/favicon.ico">

    <link rel="stylesheet" type="text/css" href="/css/webbase.css"/>
    <link rel="stylesheet" type="text/css" href="/css/pages-item.css"/>
    <link rel="stylesheet" type="text/css" href="/css/pages-zoom.css"/>
    <link rel="stylesheet" type="text/css" href="/css/widget-cartPanelView.css"/>

    <style type="text/css">
        .goods-intro-list li {
            display: inline-block;
            width: 300px;
        }

        .Ptable {
            margin: 10px 0;
        }

        .Ptable-item {
            padding: 12px 0;
            line-height: 220%;
            color: #999;
            font-size: 12px;
            border-bottom: 1px solid #eee;
        }

        .Ptable-item h3 {
            width: 110px;
            text-align: right;
        }

        .Ptable-item h3, .package-list h3 {
            font-weight: 400;
            font-size: 12px;
            float: left;
        }

        h3 {
            display: block;
            font-size: 1.17em;
            -webkit-margin-before: 1em;
            -webkit-margin-after: 1em;
            -webkit-margin-start: 0px;
            -webkit-margin-end: 0px;
            font-weight: bold;
        }

        .Ptable-item dl {
            margin-left: 110px;
        }

        dl {
            display: block;
            -webkit-margin-before: 1em;
            -webkit-margin-after: 1em;
            -webkit-margin-start: 0px;
            -webkit-margin-end: 0px;
        }

        .Ptable-item dt {
            width: 160px;
            float: left;
            text-align: right;
            padding-right: 5px;
        }

        .Ptable-item dd {
            margin-left: 210px;
        }

        dd {
            display: block;
            -webkit-margin-start: 40px;
        }

        .package-list {
            padding: 12px 0;
            line-height: 220%;
            color: #999;
            font-size: 12px;
            margin-top: -1px;
        }

        .package-list h3 {
            width: 130px;
            text-align: right;
        }

        .package-list p {
            margin-left: 155px;
            padding-right: 50px;
        }
    </style>

</head>

<body>

<!-- 头部栏位 -->
<!--页面顶部，由js动态加载-->
<div id="itemApp">
    <div id="nav-bottom">
        <ly-top/>
    </div>
    <div class="py-container">
        <div id="item">
            <div class="crumb-wrap">
                <ul class="sui-breadcrumb">
                    <li v-for="category in categories">
                        <a href="#">{{category.name}}</a>
                    </li>

                    <li>
                        <a href="#">{{brand.name}}</a>
                    </li>
                    <li class="active">{{spu.title}}</li>
                </ul>
            </div>
            <!--product-info-->
            <div class="product-info">
                <div class="fl preview-wrap">
                    <!--放大镜效果-->
                    <div class="zoom">
                        <!--默认第一个预览-->
                        <div id="preview" class="spec-preview">
							<span class="jqzoom">
								<img :jqimg="images[0]" :src="images[0]" width="400px" height="400px"/>
							</span>
                        </div>
                        <!--下方的缩略图-->
                        <div class="spec-scroll">
                            <a class="prev">&lt;</a>
                            <!--左右按钮-->
                            <div class="items">
                                <ul>
                                    <li v-for="image in images">
                                        <img :src="image" :bimg="image" onmousemove="preview(this)"/>
                                    </li>

                                </ul>
                            </div>
                            <a class="next">&gt;</a>
                        </div>
                    </div>
                </div>
                <div class="fr itemInfo-wrap">
                    <div class="sku-name">
                        <h4>{{sku.title}}</h4>
                    </div>
                    <div class="news"><span v-html="spu.subTitle"></span></div>
                    <div class="summary">
                        <div class="summary-wrap">
                            <div class="fl title"><i>价　　格</i></div>
                            <div class="fl price">
                                <i>¥</i><em>{{ly.formatPrice(sku.price)}}</em><span>降价通知</span>
                            </div>
                            <div class="fr remark"><i>累计评价</i><em>612188</em></div>
                        </div>
                        <div class="summary-wrap">
                            <div class="fl title">
                                <i>促　　销</i>
                            </div>
                            <div class="fl fix-width">
                                <i class="red-bg">加价购</i>
                                <em class="t-gray">满999.00另加20.00元，或满1999.00另加30.00元，或满2999.00另加40.00元，即可在购物车换
                                    购热销商品</em>
                            </div>
                        </div>
                    </div>
                    <div class="support">
                        <div class="summary-wrap">
                            <div class="fl title">
                                <i>支　　持</i>
                            </div>
                            <div class="fl fix-width">
                                <em class="t-gray">以旧换新，闲置手机回收 4G套餐超值抢 礼品购</em>
                            </div>
                        </div>
                        <div class="summary-wrap">
                            <div class="fl title">
                                <i>配 送 至</i>
                            </div>
                            <div class="fl fix-width">
                                <em class="t-gray">上海 <span>有货</span></em>
                            </div>
                        </div>
                    </div>
                    <div class="clearfix choose">
                        <div id="specification" class="summary-wrap clearfix">
                            <dl v-for="(value,key) in specialSpec" :key="key">
                                <dt>
                                    <div class="fl title">
                                        <i>{{paramMap[key]}}:</i>
                                    </div>
                                </dt>
                                <dd v-for="(v,i) in value" :key="i">
                                    <a href="javascript:;" :class="{selected: i===indexes[key]}"
                                       @click="indexes[key] = i">
                                        {{v}}<span title="点击取消选择">&nbsp;</span>
                                    </a>
                                </dd>

                            </dl>
                            <dl>
                                <dt>
                                    <div class="fl title">
                                        <i>购买方式</i>
                                    </div>
                                </dt>
                                <dd><a href="javascript:;" class="selected">官方标配<span title="点击取消选择">&nbsp;</span>
                                </a></dd>
                                <dd><a href="javascript:;">移动优惠版</a></dd>
                                <dd><a href="javascript:;" class="locked">电信优惠版</a></dd>
                            </dl>
                        </div>

                        <div class="summary-wrap">
                            <div class="fl title">
                                <div class="control-group">
                                    <div class="controls">
                                        <input autocomplete="off" type="text" disabled value="1" minnum="1"
                                               class="itxt" v-model="num"/>
                                        <a href="javascript:void(0)" class="increment plus" @click="num++">+</a>
                                        <a href="javascript:void(0)" class="increment mins" @click="num--">-</a>
                                    </div>
                                </div>
                            </div>
                            <div class="fl">
                                <ul class="btn-choose unstyled">
                                    <li>
                                        <a href="javascript:void(0)" target="_blank"
                                           class="sui-btn  btn-danger addshopcar" @click.prevent="addCart">加入购物车</a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--product-detail-->
            <div class="clearfix product-detail">
                <div class="fl aside">
                    <ul class="sui-nav nav-tabs tab-wraped">
                        <li class="active">
                            <a href="#index" data-toggle="tab">
                                <span>相关分类</span>
                            </a>
                        </li>
                        <li>
                            <a href="#profile" data-toggle="tab">
                                <span>推荐品牌</span>
                            </a>
                        </li>
                    </ul>
                    <div class="tab-content tab-wraped">
                        <div id="index" class="tab-pane active">
                            <ul class="part-list unstyled">
                                <li>手机</li>
                                <li>手机壳</li>
                                <li>内存卡</li>
                                <li>Iphone配件</li>
                                <li>贴膜</li>
                                <li>手机耳机</li>
                                <li>移动电源</li>
                                <li>平板电脑</li>
                            </ul>
                            <ul class="goods-list unstyled">
                                <li>
                                    <div class="list-wrap">
                                        <div class="p-img">
                                            <img src="/img/_/part01.png"/>
                                        </div>
                                        <div class="attr">
                                            <em>Apple苹果iPhone 6s (A1699)</em>
                                        </div>
                                        <div class="price">
                                            <strong>
                                                <em>¥</em>
                                                <i>6088.00</i>
                                            </strong>
                                        </div>
                                        <div class="operate">
                                            <a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
                                        </div>
                                    </div>
                                </li>
                                <li>
                                    <div class="list-wrap">
                                        <div class="p-img">
                                            <img src="/img/_/part02.png"/>
                                        </div>
                                        <div class="attr">
                                            <em>Apple苹果iPhone 6s (A1699)</em>
                                        </div>
                                        <div class="price">
                                            <strong>
                                                <em>¥</em>
                                                <i>6088.00</i>
                                            </strong>
                                        </div>
                                        <div class="operate">
                                            <a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
                                        </div>
                                    </div>
                                </li>
                                <li>
                                    <div class="list-wrap">
                                        <div class="p-img">
                                            <img src="/img/_/part03.png"/>
                                        </div>
                                        <div class="attr">
                                            <em>Apple苹果iPhone 6s (A1699)</em>
                                        </div>
                                        <div class="price">
                                            <strong>
                                                <em>¥</em>
                                                <i>6088.00</i>
                                            </strong>
                                        </div>
                                        <div class="operate">
                                            <a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
                                        </div>
                                    </div>
                                    <div class="list-wrap">
                                        <div class="p-img">
                                            <img src="/img/_/part02.png"/>
                                        </div>
                                        <div class="attr">
                                            <em>Apple苹果iPhone 6s (A1699)</em>
                                        </div>
                                        <div class="price">
                                            <strong>
                                                <em>¥</em>
                                                <i>6088.00</i>
                                            </strong>
                                        </div>
                                        <div class="operate">
                                            <a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
                                        </div>
                                    </div>
                                    <div class="list-wrap">
                                        <div class="p-img">
                                            <img src="/img/_/part03.png"/>
                                        </div>
                                        <div class="attr">
                                            <em>Apple苹果iPhone 6s (A1699)</em>
                                        </div>
                                        <div class="price">
                                            <strong>
                                                <em>¥</em>
                                                <i>6088.00</i>
                                            </strong>
                                        </div>
                                        <div class="operate">
                                            <a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div id="profile" class="tab-pane">
                            <p>推荐品牌</p>
                        </div>
                    </div>
                </div>
                <div class="fr detail">
                    <div class="clearfix fitting">
                        <h4 class="kt">选择搭配</h4>
                        <div class="good-suits">
                            <div class="fl master">
                                <div class="list-wrap">
                                    <div class="p-img">
                                        <img src="/img/_/l-m01.png"/>
                                    </div>
                                    <em>￥5299</em>
                                    <i>+</i>
                                </div>
                            </div>
                            <div class="fl suits">
                                <ul class="suit-list">
                                    <li class="">
                                        <div id="">
                                            <img src="/img/_/dp01.png"/>
                                        </div>
                                        <i>Feless费勒斯VR</i>
                                        <label data-toggle="checkbox" class="checkbox-pretty">
                                            <input type="checkbox"><span>39</span>
                                        </label>
                                    </li>
                                    <li class="">
                                        <div id=""><img src="/img/_/dp02.png"/></div>
                                        <i>Feless费勒斯VR</i>
                                        <label data-toggle="checkbox" class="checkbox-pretty">
                                            <input type="checkbox"><span>50</span>
                                        </label>
                                    </li>
                                    <li class="">
                                        <div id=""><img src="/img/_/dp03.png"/></div>
                                        <i>Feless费勒斯VR</i>
                                        <label data-toggle="checkbox" class="checkbox-pretty">
                                            <input type="checkbox"><span>59</span>
                                        </label>
                                    </li>
                                    <li class="">
                                        <div id=""><img src="/img/_/dp04.png"/></div>
                                        <i>Feless费勒斯VR</i>
                                        <label data-toggle="checkbox" class="checkbox-pretty">
                                            <input type="checkbox"><span>99</span>
                                        </label>
                                    </li>
                                </ul>
                            </div>
                            <div class="fr result">
                                <div class="num">已选购0件商品</div>
                                <div class="price-tit"><strong>套餐价</strong></div>
                                <div class="price">￥5299</div>
                                <button class="sui-btn  btn-danger addshopcar">加入购物车</button>
                            </div>
                        </div>
                    </div>
                    <div class="tab-main intro">
                        <ul class="sui-nav nav-tabs tab-wraped">
                            <li class="active">
                                <a href="#one" data-toggle="tab">
                                    <span>商品介绍</span>
                                </a>
                            </li>
                            <li>
                                <a href="#two" data-toggle="tab">
                                    <span>规格与包装</span>
                                </a>
                            </li>
                            <li>
                                <a href="#three" data-toggle="tab">
                                    <span>售后保障</span>
                                </a>
                            </li>
                            <li>
                                <a href="#four" data-toggle="tab">
                                    <span>商品评价</span>
                                </a>
                            </li>
                            <li>
                                <a href="#five" data-toggle="tab">
                                    <span>手机社区</span>
                                </a>
                            </li>
                        </ul>
                        <div class="clearfix"></div>
                        <div class="tab-content tab-wraped">
                            <div id="one" class="tab-pane active">
                                <ul class="goods-intro-list unstyled" style="list-style: none;">
                                    <li>分辨率：1920*1080(FHD)</li>
                                    <li>后置摄像头：1200万像素</li>
                                    <li>前置摄像头：500万像素</li>
                                    <li>核 数：其他</li>
                                    <li>频 率：以官网信息为准</li>
                                    <li>品牌： Apple</li>
                                    <li>商品名称：APPLEiPhone 6s Plus</li>
                                    <li>商品编号：1861098</li>
                                    <li>商品毛重：0.51kg</li>
                                    <li>商品产地：中国大陆</li>
                                    <li>热点：指纹识别，Apple Pay，金属机身，拍照神器</li>
                                    <li>系统：苹果（IOS）</li>
                                    <li>像素：1000-1600万</li>
                                    <li>机身内存：64GB</li>
                                </ul>
                                <!--商品详情-->
                                <div class="intro-detail" v-html="spuDetail.description">

                                </div>
                            </div>
                            <div id="two" class="tab-pane">
                                <div class="Ptable">
                                    <div class="Ptable-item" v-for="group in groups">
                                        <h3>{{group.name}}</h3>
                                        <dl v-for="param in group.params">
                                            <dt>{{param.name}}</dt>
                                            <dd>{{param.generic ? ((genericSpec[param.id] || "其他") + (param.unit || ""))
                                                : JSON.parse(sku.ownSpec)[param.id]}}
                                            </dd>

                                        </dl>
                                    </div>

                                </div>
                                <div class="package-list">
                                    <h3>包装清单</h3>
                                    <p>手机X1、快速指南X1、华为SuperCharge 充电器X1、三包凭证X1、Type-C 数字耳机X1、Type-C
                                        数据线X1、取卡针X1、TPU保护壳X1、USB Type-C转3.5mm耳机转接线X1（备注：最终以实物为准）</p>
                                </div>

                            </div>
                            <div id="three" class="tab-pane">
                                <p>售后保障</p>
                            </div>
                            <div id="four" class="tab-pane">
                                <p>商品评价</p>
                            </div>
                            <div id="five" class="tab-pane">
                                <p>手机社区</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--like-->
            <div class="clearfix"></div>
            <div class="like">
                <h4 class="kt">猜你喜欢</h4>
                <div class="like-list">
                    <ul class="yui3-g">
                        <li class="yui3-u-1-6">
                            <div class="list-wrap">
                                <div class="p-img">
                                    <img src="/img/_/itemlike01.png"/>
                                </div>
                                <div class="attr">
                                    <em>DELL戴尔Ins 15MR-7528SS 15英寸 银色 笔记本</em>
                                </div>
                                <div class="price">
                                    <strong>
                                        <em>¥</em>
                                        <i>3699.00</i>
                                    </strong>
                                </div>
                                <div class="commit">
                                    <i class="command">已有6人评价</i>
                                </div>
                            </div>
                        </li>
                        <li class="yui3-u-1-6">
                            <div class="list-wrap">
                                <div class="p-img">
                                    <img src="/img/_/itemlike02.png"/>
                                </div>
                                <div class="attr">
                                    <em>Apple苹果iPhone 6s/6s Plus 16G 64G 128G</em>
                                </div>
                                <div class="price">
                                    <strong>
                                        <em>¥</em>
                                        <i>4388.00</i>
                                    </strong>
                                </div>
                                <div class="commit">
                                    <i class="command">已有700人评价</i>
                                </div>
                            </div>
                        </li>
                        <li class="yui3-u-1-6">
                            <div class="list-wrap">
                                <div class="p-img">
                                    <img src="/img/_/itemlike03.png"/>
                                </div>
                                <div class="attr">
                                    <em>DELL戴尔Ins 15MR-7528SS 15英寸 银色 笔记本</em>
                                </div>
                                <div class="price">
                                    <strong>
                                        <em>¥</em>
                                        <i>4088.00</i>
                                    </strong>
                                </div>
                                <div class="commit">
                                    <i class="command">已有700人评价</i>
                                </div>
                            </div>
                        </li>
                        <li class="yui3-u-1-6">
                            <div class="list-wrap">
                                <div class="p-img">
                                    <img src="/img/_/itemlike04.png"/>
                                </div>
                                <div class="attr">
                                    <em>DELL戴尔Ins 15MR-7528SS 15英寸 银色 笔记本</em>
                                </div>
                                <div class="price">
                                    <strong>
                                        <em>¥</em>
                                        <i>4088.00</i>
                                    </strong>
                                </div>
                                <div class="commit">
                                    <i class="command">已有700人评价</i>
                                </div>
                            </div>
                        </li>
                        <li class="yui3-u-1-6">
                            <div class="list-wrap">
                                <div class="p-img">
                                    <img src="/img/_/itemlike05.png"/>
                                </div>
                                <div class="attr">
                                    <em>DELL戴尔Ins 15MR-7528SS 15英寸 银色 笔记本</em>
                                </div>
                                <div class="price">
                                    <strong>
                                        <em>¥</em>
                                        <i>4088.00</i>
                                    </strong>
                                </div>
                                <div class="commit">
                                    <i class="command">已有700人评价</i>
                                </div>
                            </div>
                        </li>
                        <li class="yui3-u-1-6">
                            <div class="list-wrap">
                                <div class="p-img">
                                    <img src="/img/_/itemlike06.png"/>
                                </div>
                                <div class="attr">
                                    <em>DELL戴尔Ins 15MR-7528SS 15英寸 银色 笔记本</em>
                                </div>
                                <div class="price">
                                    <strong>
                                        <em>¥</em>
                                        <i>4088.00</i>
                                    </strong>
                                </div>
                                <div class="commit">
                                    <i class="command">已有700人评价</i>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

</div>
<script src="/js/vue/vue.js"></script>
<script src="/js/axios.min.js"></script>
<script src="/js/common.js"></script>
<script>

    const a = [{"id":1,"cid":76,"name":"\u4E3B\u4F53","params":[{"id":1,"cid":76,"groupId":1,"name":"\u54C1\u724C","numeric":false,"unit":"","generic":true,"searching":false,"segments":""},{"id":2,"cid":76,"groupId":1,"name":"\u578B\u53F7","numeric":false,"unit":"","generic":true,"searching":false,"segments":""},{"id":3,"cid":76,"groupId":1,"name":"\u4E0A\u5E02\u5E74\u4EFD","numeric":true,"unit":"\u5E74","generic":true,"searching":false,"segments":""}]},{"id":2,"cid":76,"name":"\u57FA\u672C\u4FE1\u606F","params":[{"id":4,"cid":76,"groupId":2,"name":"\u673A\u8EAB\u989C\u8272","numeric":false,"unit":"","generic":false,"searching":false,"segments":""},{"id":5,"cid":76,"groupId":2,"name":"\u673A\u8EAB\u91CD\u91CF\uFF08g\uFF09","numeric":true,"unit":"g","generic":true,"searching":false,"segments":""},{"id":6,"cid":76,"groupId":2,"name":"\u673A\u8EAB\u6750\u8D28\u5DE5\u827A","numeric":false,"unit":"","generic":true,"searching":false,"segments":""}]},{"id":3,"cid":76,"name":"\u64CD\u4F5C\u7CFB\u7EDF","params":[{"id":7,"cid":76,"groupId":3,"name":"\u64CD\u4F5C\u7CFB\u7EDF","numeric":false,"unit":"","generic":true,"searching":true,"segments":""}]},{"id":4,"cid":76,"name":"\u4E3B\u82AF\u7247","params":[{"id":8,"cid":76,"groupId":4,"name":"CPU\u54C1\u724C","numeric":false,"unit":"","generic":true,"searching":true,"segments":""},{"id":9,"cid":76,"groupId":4,"name":"CPU\u578B\u53F7","numeric":false,"unit":"","generic":true,"searching":false,"segments":""},{"id":10,"cid":76,"groupId":4,"name":"CPU\u6838\u6570","numeric":false,"unit":"","generic":true,"searching":true,"segments":""},{"id":11,"cid":76,"groupId":4,"name":"CPU\u9891\u7387","numeric":true,"unit":"GHz","generic":true,"searching":true,"segments":"0-1.0,1.0-1.5,1.5-2.0,2.0-2.5,2.5-"}]},{"id":5,"cid":76,"name":"\u5B58\u50A8","params":[{"id":12,"cid":76,"groupId":5,"name":"\u5185\u5B58","numeric":false,"unit":"","generic":false,"searching":true,"segments":""},{"id":13,"cid":76,"groupId":5,"name":"\u673A\u8EAB\u5B58\u50A8","numeric":false,"unit":"","generic":false,"searching":true,"segments":""}]},{"id":6,"cid":76,"name":"\u6444\u50CF\u5934","params":[{"id":16,"cid":76,"groupId":6,"name":"\u524D\u7F6E\u6444\u50CF\u5934","numeric":true,"unit":"\u4E07","generic":true,"searching":true,"segments":"0-500,500-1000,1000-1500,1500-2000,2500-"},{"id":17,"cid":76,"groupId":6,"name":"\u540E\u7F6E\u6444\u50CF\u5934","numeric":true,"unit":"\u4E07","generic":true,"searching":true,"segments":"0-500,500-1000,1000-1500,1500-2000,2500-"}]},{"id":7,"cid":76,"name":"\u7535\u6C60\u4FE1\u606F","params":[{"id":18,"cid":76,"groupId":7,"name":"\u7535\u6C60\u5BB9\u91CF\uFF08mAh\uFF09","numeric":true,"unit":"mAh","generic":true,"searching":true,"segments":"0-2000,2000-3000,3000-4000,4000-"}]},{"id":11,"cid":76,"name":"\u5C4F\u5E55","params":[{"id":14,"cid":76,"groupId":11,"name":"\u4E3B\u5C4F\u5E55\u5C3A\u5BF8\uFF08\u82F1\u5BF8\uFF09","numeric":true,"unit":"\u82F1\u5BF8","generic":true,"searching":true,"segments":"0-4.0,4.0-5.0,5.0-5.5,5.5-6.0,6.0-"},{"id":15,"cid":76,"groupId":11,"name":"\u5206\u8FA8\u7387","numeric":false,"unit":"","generic":true,"searching":false,"segments":""}]}];
    const b = {"4":"\u673A\u8EAB\u989C\u8272","12":"\u5185\u5B58","13":"\u673A\u8EAB\u5B58\u50A8"};
    const c = [{"id":74,"name":"\u624B\u673A","parentId":null,"isParent":null,"sort":null},{"id":75,"name":"\u624B\u673A\u901A\u8BAF","parentId":null,"isParent":null,"sort":null},{"id":76,"name":"\u624B\u673A","parentId":null,"isParent":null,"sort":null}];
    const d = {"id":93,"brandId":8557,"cid1":74,"cid2":75,"cid3":76,"title":"\u534E\u4E3A\uFF08HUAWEI\uFF09 \u534E\u4E3AP10 Plus \u624B\u673A ","subTitle":"64G\u7248\u672C\u4EC5\u97002766\u5143\uFF0C256G \u9ED1\u3001\u91D1\u3001\u7389\u8272\u73B0\u8D27\u901F\u53D1\uFF01<a href=\"https:\/\/item.jd.com\/26652299286.html\" target=\"_blank\">P20 Pro\u70B9\u8FD9<\/a>","saleable":true,"valid":true,"createTime":"2018-04-21T15:58:19.000+08:00","lastUpdateTime":"2018-04-21T15:58:19.000+08:00"};
    const e = {"spuId":93,"description":"<style>\/*C-B*\/\n\n.ssd-module-wrap {width: 750px; margin: 0 auto; position: relative; text-align: left; background-color: #ffffff; }\n.ssd-module-wrap .ssd-module,.ssd-module-wrap .ssd-module-heading{ width: 750px; position:relative; overflow: hidden;  }\n.ssd-module{background-repeat:no-repeat; background-position:left center; background-size:100% 100%;}\n.ssd-module .ssd-widget-pic,.ssd-module .ssd-widget-text,.ssd-module .ssd-widget-line,.ssd-module-wrap .ssd-widget-rectangle,.ssd-module-wrap .ssd-widget-circle,.ssd-module-wrap .ssd-widget-triangle,.ssd-module-wrap .ssd-widget-table{ position: absolute; overflow: hidden; }\n.ssd-module-wrap .ssd-widget-table th,.ssd-module-wrap .ssd-widget-table td{position:relative;}\n.ssd-module .ssd-widget-pic img{display: block; width:100%; height:100% }\n.ssd-module .ssd-widget-text{ position: absolute; overflow: hidden;}\n.ssd-module .ssd-widget-text span{display:block;overflow:hidden; width:100%;  height:100%; padding:0; margin: 0; word-break:break-all; word-wrap:break-word; white-space:normal;}\n.ssd-module .ssd-widget-link{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: transparent;z-index:100 }\n.ssd-module-wrap .ssd-widget-text{ line-height: 1.5; }\n.ssd-module-wrap .ssd-cell-text{position:absolute;top:0;left:0;right:0;width: 100%;height: 100%;overflow: auto;}\n.ssd-module-heading{background-repeat:no-repeat; background-position:left center; background-size:100% 100%; }\n.ssd-module-heading .ssd-module-heading-layout{display:inline-block;}\n.ssd-module-heading .ssd-widget-heading-ch{float: left;display: inline-block;margin-left: 15px; margin-right:6px; height: 100%;}\n.ssd-module-heading .ssd-widget-heading-en{float: left;display: inline-block;margin-left: 6px; margin-right:15px; height: 100%;}\n.ssd-module-wrap .ssd-widget-rectangle{box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;}\n\/*C-E*\/.ssd-module-wrap .M14989663249721{height:79px; width:750px; background-color:#b3b3b3; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t5728\/55\/4877720561\/69104\/1f13f880\/59574e38Nadefb07e.jpg)}\n.ssd-module-wrap .M15036419547361{height:992px; width:750px; background-color:#b3b3b3; background-image:url(https:\/\/img30.360buyimg.com\/imgzone\/jfs\/t9133\/118\/53631227\/669000\/c4b31050\/599fbf9fN30e9135e.jpg)}\n.ssd-module-wrap .M14994085534521{height:321px; width:750px; background-color:#b3b3b3; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t5737\/107\/5374803380\/241718\/be165873\/595f2223N39553ec2.jpg)}\n.ssd-module-wrap .M14972469293961{height:1154px; width:750px; background-color:#f2f2f2; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6616\/309\/519357455\/331258\/c8c10183\/59411324N94c274c0.jpg)}\n.ssd-module-wrap .M14935307605472{height:658px; width:750px; background-color:#b3b3b3; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6559\/305\/551574849\/320853\/876fee5\/59411324Ne78d5882.jpg)}\n.ssd-module-wrap .M14935307739513{height:165px; width:750px; background-color:#cbcbcb; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6448\/343\/522551567\/57358\/540b705a\/59411324Nfbce29be.jpg)}\n.ssd-module-wrap .M14935307881434{height:497px; width:750px; background-color:#b3b3b3; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6337\/222\/537968894\/265365\/eb88d6f9\/59411324Ne9100405.jpg)}\n.ssd-module-wrap .M14935308003635{height:508px; width:750px; background-color:#d7d7d7; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6418\/302\/543293885\/389758\/c5a07495\/59411325N9e7251aa.jpg)}\n.ssd-module-wrap .M14955909309291{height:500px; width:750px; background-color:#cbcbcb; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6193\/338\/558634948\/385721\/d84e8b6f\/59411325N913d43e1.jpg)}\n.ssd-module-wrap .M14960450718291{height:499px; width:750px; background-color:#b3b3b3; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6448\/350\/537075016\/243072\/421d0a40\/59411324N08efc612.jpg)}\n.ssd-module-wrap .M14960450861812{height:524px; width:750px; background-color:#e9e9e9; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6409\/264\/593935813\/282179\/61b7e371\/59411325Nc1aef47f.jpg)}\n.ssd-module-wrap .M14974370277601{height:499px; width:750px; background-color:#d7d7d7; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6067\/285\/2425331009\/345468\/5d2ae9fc\/5941137fN1bfde268.jpg)}\n.ssd-module-wrap .M14974370504862{height:500px; width:750px; background-color:#b3b3b3; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6172\/68\/551333703\/379975\/6b6e2165\/59411381Ned53d6cf.jpg)}\n.ssd-module-wrap .M14974370604663{height:500px; width:750px; background-color:#e9e9e9; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t5668\/266\/3660010249\/394860\/a9c39a2b\/59411382N63712b8a.jpg)}\n.ssd-module-wrap .M14974370709414{height:500px; width:750px; background-color:#cbcbcb; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6256\/166\/536406976\/294224\/8c5d1566\/59411382Nc69c33a5.jpg)}\n.ssd-module-wrap .M14974370801315{height:500px; width:750px; background-color:#d7d7d7; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t5710\/323\/3741219709\/256330\/ba7113cb\/59411381N04d6aa5c.jpg)}\n.ssd-module-wrap .M14974370886686{height:500px; width:750px; background-color:#cbcbcb; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6043\/194\/2144398667\/277202\/d648bec2\/59411382Ne988ef20.jpg)}\n.ssd-module-wrap .M14974370977237{height:500px; width:750px; background-color:#f2f2f2; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6586\/160\/546571127\/397448\/dae3201d\/59411382Na6e81e2a.jpg)}\n.ssd-module-wrap .M14989663437952{height:185px; width:750px; background-color:#d7d7d7; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t5935\/79\/3790504007\/127881\/f68be3a3\/59573cf6Nacd1773e.jpg)}\n.ssd-module-wrap .M14972488124465{height:450px; width:750px; background-color:#cbcbcb; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6388\/70\/94495240\/339020\/eb385720\/59392635N2d8555a5.jpg)}\n.ssd-module-wrap .M14974371098918{height:292px; width:750px; background-color:#e9e9e9; background-image:url(https:\/\/img30.360buyimg.com\/sku\/jfs\/t6199\/100\/561002798\/127386\/7bb8c1e\/594113ccNd0463dff.jpg)}\n.ssd-module-wrap .M14935309760672{height:575px; width:750px; background-color:#d7d7d7; background-image:url(https:\/\/img30.360buyimg.com\/imgzone\/jfs\/t4855\/73\/954592765\/257757\/13a2aab4\/58eb3544N6755d4a5.jpg)}\n.ssd-module-wrap .M14935310087393{height:677px; width:750px; background-color:#cbcbcb; background-image:url(https:\/\/img30.360buyimg.com\/imgzone\/jfs\/t4906\/209\/934432517\/288022\/28972a4b\/58eb3545N7417055f.jpg)}\n<\/style><br\/><div align=\"center\"><img alt=\"\" src=\"\/\/img10.360buyimg.com\/imgzone\/jfs\/t8671\/222\/1467175489\/71564\/f39ed996\/59ba12f2Nd0a1fcd2.jpg\" \/><br \/><img alt=\"\" src=\"\/\/img30.360buyimg.com\/sku\/jfs\/t8296\/346\/63435530\/301664\/569618e2\/599fc209N9e15ed71.jpg\" \/><img alt=\"\" src=\"\/\/img30.360buyimg.com\/popWaterMark\/jfs\/t11113\/108\/2092000558\/553384\/923f9d34\/5a13fd31Nc20513fd.jpg\" \/><br \/><img alt=\"\" src=\"\/\/img30.360buyimg.com\/popWaterMark\/jfs\/t12487\/352\/1613761144\/385845\/4948abf9\/5a251ed2Nccef8208.jpg\" \/><br \/><img alt=\"\" src=\"\/\/img30.360buyimg.com\/sku\/jfs\/t7978\/358\/1724592445\/47677\/ec69d21d\/599fc208Nadf60b43.jpg\" \/><img alt=\"\" src=\"\/\/img30.360buyimg.com\/popWaterMark\/jfs\/t13936\/230\/647391278\/126143\/a91326fb\/5a10fc00N5dacd989.jpg\" \/><br \/><img alt=\"\" src=\"\/\/img30.360buyimg.com\/popWaterMark\/jfs\/t8197\/250\/1434527911\/451912\/ed5b2190\/59ba2036N4394d1c4.jpg\" \/><br \/><img alt=\"\" src=\"\/\/img30.360buyimg.com\/popWaterMark\/jfs\/t8404\/273\/1456098444\/529379\/52be66b6\/59ba2036N590ede4c.jpg\" \/><br \/><img alt=\"\" src=\"\/\/img30.360buyimg.com\/popWaterMark\/jfs\/t9457\/55\/1332786920\/1062090\/1b067392\/59ba202bN8c650396.jpg\" \/><br \/><img alt=\"\" src=\"\/\/img30.360buyimg.com\/popWaterMark\/jfs\/t8431\/238\/1475657654\/959391\/f5b6a75f\/59ba2032N4d441a9c.jpg\" \/><br \/><br \/><img alt=\"\" src=\"\/\/img10.360buyimg.com\/imgzone\/jfs\/t8839\/246\/975359774\/286380\/acd0cb2c\/59ba2295Nad6a849a.jpg\" \/><br \/><br \/><img alt=\"\" src=\"\/\/img10.360buyimg.com\/imgzone\/jfs\/t9280\/263\/991038113\/240493\/5cc1a0d2\/59ba1663N99313921.jpg\" \/><br \/><img alt=\"\" src=\"\/\/img10.360buyimg.com\/imgzone\/jfs\/t8881\/270\/1452713119\/654115\/f4203680\/59ba1667N6883b619.jpg\" \/><br \/><br \/><\/div><br\/><script><\/script><br\/>","specialSpec":"{\"4\":[\"\u66DC\u77F3\u9ED1\",\"\u4EAE\u9ED1\",\"\u94BB\u96D5\u84DD\",\"\u94BB\u96D5\u91D1\",\"\u9676\u74F7\u767D\",\"\u8349\u6728\u7EFF\",\"\u5170\u7389\u9650\u91CF\u5B9A\u5236\u7248\",\"\u73AB\u7470\u91D1\"],\"12\":[\"6GB\"],\"13\":[\"64GB\"]}","genericSpec":"{\"1\":\"\u5176\u5B83\",\"2\":\"VKY-AL00\",\"3\":2017.0,\"5\":165,\"6\":\"\u5176\u5B83\",\"7\":\"Android\",\"8\":\"\u6D77\u601D\uFF08Hisilicon\uFF09\",\"9\":\"\u5176\u4ED6\",\"10\":\"\u516B\u6838\",\"11\":2.4,\"14\":5.5,\"15\":\"\u5176\u4ED6\",\"16\":800.0,\"17\":1200.0,\"18\":3750.0}","packingList":"\u8BF7\u8F93\u5165...","afterService":"\u672C\u4EA7\u54C1\u5168\u56FD\u8054\u4FDD\uFF0C\u4EAB\u53D7\u4E09\u5305\u670D\u52A1\uFF0C\u8D28\u4FDD\u671F\u4E3A\uFF1A\u4E00\u5E74\u8D28\u4FDD"};
    const f = [{"id":13164693175,"spuId":93,"title":"\u534E\u4E3A\uFF08HUAWEI\uFF09 \u534E\u4E3AP10 Plus \u624B\u673A \u9676\u74F7\u767D \u5168\u7F51\u901A(6G+128G)","images":"http:\/\/image.leyou.com\/images\/8\/1\/1524297497591.jpg","price":378800,"ownSpec":"{\"4\":\"\u9676\u74F7\u767D\",\"12\":\"6GB\",\"13\":\"64GB\"}","indexes":"4_0_0","enable":true,"createTime":"2018-04-21T15:58:18.000+08:00","lastUpdateTime":"2018-04-21T15:58:18.000+08:00","stock":9999},{"id":13164693176,"spuId":93,"title":"\u534E\u4E3A\uFF08HUAWEI\uFF09 \u534E\u4E3AP10 Plus \u624B\u673A \u66DC\u77F3\u9ED1 \u5168\u7F51\u901A(6G+128G)","images":"http:\/\/image.leyou.com\/images\/1\/2\/1524297495532.jpg","price":378800,"ownSpec":"{\"4\":\"\u66DC\u77F3\u9ED1\",\"12\":\"6GB\",\"13\":\"64GB\"}","indexes":"0_0_0","enable":true,"createTime":"2018-04-21T15:58:16.000+08:00","lastUpdateTime":"2018-04-21T15:58:16.000+08:00","stock":9999},{"id":13164693177,"spuId":93,"title":"\u534E\u4E3A\uFF08HUAWEI\uFF09 \u534E\u4E3AP10 Plus \u624B\u673A \u8349\u6728\u7EFF \u5168\u7F51\u901A(6G+128G)","images":"http:\/\/image.leyou.com\/images\/10\/9\/1524297498088.jpg","price":378800,"ownSpec":"{\"4\":\"\u8349\u6728\u7EFF\",\"12\":\"6GB\",\"13\":\"64GB\"}","indexes":"5_0_0","enable":true,"createTime":"2018-04-21T15:58:18.000+08:00","lastUpdateTime":"2018-04-21T15:58:18.000+08:00","stock":9999},{"id":13164693182,"spuId":93,"title":"\u534E\u4E3A\uFF08HUAWEI\uFF09 \u534E\u4E3AP10 Plus \u624B\u673A \u94BB\u96D5\u91D1 \u5168\u7F51\u901A(6G+128G)","images":"http:\/\/image.leyou.com\/images\/8\/2\/1524297496947.jpg","price":378800,"ownSpec":"{\"4\":\"\u94BB\u96D5\u91D1\",\"12\":\"6GB\",\"13\":\"64GB\"}","indexes":"3_0_0","enable":true,"createTime":"2018-04-21T15:58:17.000+08:00","lastUpdateTime":"2018-04-21T15:58:17.000+08:00","stock":9999},{"id":13164693185,"spuId":93,"title":"\u534E\u4E3A\uFF08HUAWEI\uFF09 \u534E\u4E3AP10 Plus \u624B\u673A \u94BB\u96D5\u84DD \u5168\u7F51\u901A(6G+128G)","images":"http:\/\/image.leyou.com\/images\/3\/2\/1524297496502.jpg","price":378800,"ownSpec":"{\"4\":\"\u94BB\u96D5\u84DD\",\"12\":\"6GB\",\"13\":\"64GB\"}","indexes":"2_0_0","enable":true,"createTime":"2018-04-21T15:58:17.000+08:00","lastUpdateTime":"2018-04-21T15:58:17.000+08:00","stock":9999},{"id":13164693190,"spuId":93,"title":"\u534E\u4E3A\uFF08HUAWEI\uFF09 \u534E\u4E3AP10 Plus \u624B\u673A \u73AB\u7470\u91D1 \u5168\u7F51\u901A(6G+64G)","images":"http:\/\/image.leyou.com\/images\/14\/7\/1524297499049.jpg","price":276600,"ownSpec":"{\"4\":\"\u73AB\u7470\u91D1\",\"12\":\"6GB\",\"13\":\"64GB\"}","indexes":"7_0_0","enable":true,"createTime":"2018-04-21T15:58:19.000+08:00","lastUpdateTime":"2018-04-21T15:58:19.000+08:00","stock":9999},{"id":17347463834,"spuId":93,"title":"\u534E\u4E3A\uFF08HUAWEI\uFF09 \u534E\u4E3AP10 Plus \u624B\u673A \u4EAE\u9ED1 \u5168\u7F51\u901A(6G+128G)","images":"http:\/\/image.leyou.com\/images\/11\/7\/1524297496098.jpg","price":378800,"ownSpec":"{\"4\":\"\u4EAE\u9ED1\",\"12\":\"6GB\",\"13\":\"64GB\"}","indexes":"1_0_0","enable":true,"createTime":"2018-04-21T15:58:16.000+08:00","lastUpdateTime":"2018-04-21T15:58:16.000+08:00","stock":9999},{"id":25573151670,"spuId":93,"title":"\u534E\u4E3A\uFF08HUAWEI\uFF09 \u534E\u4E3AP10 Plus \u624B\u673A \u5170\u7389\u9650\u91CF\u5B9A\u5236\u7248 \u5168\u7F51\u901A(6G+256G)","images":"http:\/\/image.leyou.com\/images\/0\/6\/1524297498501.jpg","price":458800,"ownSpec":"{\"4\":\"\u5170\u7389\u9650\u91CF\u5B9A\u5236\u7248\",\"12\":\"6GB\",\"13\":\"64GB\"}","indexes":"6_0_0","enable":true,"createTime":"2018-04-21T15:58:19.000+08:00","lastUpdateTime":"2018-04-21T15:58:19.000+08:00","stock":9999}];
    const g = {"id":8557,"name":"\u534E\u4E3A\uFF08HUAWEI\uFF09","image":"http:\/\/img10.360buyimg.com\/popshop\/jfs\/t5662\/36\/8888655583\/7806\/1c629c01\/598033b4Nd6055897.jpg","letter":"H"};


    //特有规格参数集合
    const specialSpec = JSON.parse("{\"4\":[\"\u66DC\u77F3\u9ED1\",\"\u4EAE\u9ED1\",\"\u94BB\u96D5\u84DD\",\"\u94BB\u96D5\u91D1\",\"\u9676\u74F7\u767D\",\"\u8349\u6728\u7EFF\",\"\u5170\u7389\u9650\u91CF\u5B9A\u5236\u7248\",\"\u73AB\u7470\u91D1\"],\"12\":[\"6GB\"],\"13\":[\"64GB\"]}");

    let indexes = {};

    Object.keys(specialSpec).forEach(key => {
        indexes[key] = 0;
    })

    //公有规格参数集合
    const genericSpec = JSON.parse("{\"1\":\"\u5176\u5B83\",\"2\":\"VKY-AL00\",\"3\":2017.0,\"5\":165,\"6\":\"\u5176\u5B83\",\"7\":\"Android\",\"8\":\"\u6D77\u601D\uFF08Hisilicon\uFF09\",\"9\":\"\u5176\u4ED6\",\"10\":\"\u516B\u6838\",\"11\":2.4,\"14\":5.5,\"15\":\"\u5176\u4ED6\",\"16\":800.0,\"17\":1200.0,\"18\":3750.0}");

</script>

<script>
    var itemVm = new Vue({
        el: "#itemApp",
        data: {
            categories: c,
            brand: g,
            spu: d,
            skus: f,
            paramMap: b,
            specialSpec,
            indexes,
            ly,
            spuDetail: e,
            groups: a,
            genericSpec,
            num: 1


        },
        components: {
            lyTop: () => import('/js/pages/top.js')
        },
        computed: {
            sku() {
                const index = Object.values(this.indexes).join("_");//[0,0,0]  0_0_0
                return this.skus.find(s => s.indexes == index);
            },
            images() {
                return this.sku.images ? this.sku.images.split(",") : ['']
            }
        },
        methods: {
            addCart() {

                let cart = {
                    skuId: this.sku.id,
                    title: this.sku.title,
                    image: this.images[0],
                    price: this.sku.price,
                    num: this.num,
                    ownSpec: this.sku.ownSpec
                };

                ly.http.get("auth/verify")
                    .then(resp => {
                        //已经登录

                        ly.http.post("/cart/addCart", cart)
                            .then(resp => {
                                // 跳转  用来展示购物车的内容
                                window.location.href = "http://www.leyou.com/cart.html";
                            }).catch(resp => {
                            alert("添加失败");
                        })

                    }).catch(resp => {
                    //未登录
                    /**
                     * 构造一个购物车的数据对象
                     * */

                    //看一下本地localStorage有没有存过这个玩意，如果已经存过了，改数量
                    let localCarts = ly.store.get("localCarts") || [];

                    let storeCart = localCarts.find(ct => ct.skuId === cart.skuId);

                    //本地已经有了就改值
                    if (storeCart) {
                        storeCart.num = storeCart.num + cart.num;
                    } else {
                        localCarts.push(cart);
                    }

                    //把最新的数据重新存储
                    ly.store.set("localCarts", localCarts);

                    // 跳转  用来展示购物车的内容
                    window.location.href = "http://www.leyou.com/cart.html";
                })
            }
        }
    });
</script>

<script type="text/javascript" src="/js/plugins/jquery/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        $("#service").hover(function () {
            $(".service").show();
        }, function () {
            $(".service").hide();
        });
        $("#shopcar").hover(function () {
            $("#shopcarlist").show();
        }, function () {
            $("#shopcarlist").hide();
        });

    })
</script>
<script type="text/javascript" src="/js/model/cartModel.js"></script>
<script type="text/javascript" src="/js/plugins/jquery.easing/jquery.easing.min.js"></script>
<script type="text/javascript" src="/js/plugins/sui/sui.min.js"></script>
<script type="text/javascript" src="/js/plugins/jquery.jqzoom/jquery.jqzoom.js"></script>
<script type="text/javascript" src="/js/plugins/jquery.jqzoom/zoom.js"></script>
<script type="text/javascript" src="index/index.js"></script>
</body>

</html>